<!doctype html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
    <meta name="generator" content="Hugo 0.101.0">
    <title>英语错题追加画面</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/4.6/examples/checkout/">
    <!-- Bootstrap core CSS -->
    <link href="/eng/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link href="/eng/css/form-validation.css" rel="stylesheet">
</head>

<body class="bg-light">

    <div class="container">
        <form class="needs-validation" id="form" action="/eng/englishIns" method="post" enctype="multipart/form-data">

            <div class="row">

                <div class="col-md-6 order-md-1">
                   <h4 class="mb-3">英语错题</h4>
                   <div th:text="${msg}"></div>
                    <div class="form-group">
                        <label for="xueke"class="col-md-2 control-label">学科:</label>
                        <div class="col-md-10">
                            <input type="text" class="form-control" name="xueke" id="xueke" placeholder="" value="英语" disabled="true" >
                            <input type="hidden" name="hidXueke" id="hidXueke" value="英语">
                        </div>
                    </div>
                
                    <div class="form-group">
                        <label for="xueqi" class="col-md-2 control-label">学期:</label>
                        <div class="col-md-10">
                            <select name="xueqi" id="xueqi" class="form-control">
                                <option value="0">----请选择----</option>
                                <option value="高一（上）">高一（上）</option>
                                <option value="高一（下）">高一（下）</option>
                                <option value="高二（上）">高二（上）</option>
                                <option value="高二（下）">高二（下）</option>
                                <option value="高三（上）">高三（上）</option>
                                <option value="高三（下）">高三（下）</option>
                            </select>
                        </div> 
                    </div>
                    <div class="form-group">
                        <label for="zhangjie" class="col-md-2 control-label">章节:</label>
                        <div class="col-md-8">
                            <select name="zhangjie" id="zhangjie" class="form-control" >
                                <option value="0">----请选择----</option>
                                <option th:each="zj: ${allZj}" th:value="${zj}" th:text="${zj}">函数1</option>
                            </select>
                        </div> 
                    </div>                        
                    <div class="form-group">
                        <label for="zsd" class="col-md-3 control-label">知识点:</label>
                        <div class="col-md-8">
                            <input type="text" name="zsd" id="zsd" class="form-control" placeholder="考试要点之类" value="">
                        </div>                  
                    </div>                                     
                    <div class="form-group">
                        <label for="fenlei1" class="col-md-3 control-label">大分类:</label>
                        <div class="col-md-8">
                            <select name="fenlei1" id="fenlei1" class="form-control">
                                <option value="0">----请选择----</option>
                                <option value="校内习题">校内习题</option>
                                <option value="校外习题">校外习题</option>
                                <option value="自主练习">自主练习</option>
                            </select>
                        </div>                                                                                                
                    </div>
                    <div class="form-group">
                        <label for="fenlei2" class="col-md-3 control-label">中分类:</label>
                        <div class="col-md-8">
                            <select name="fenlei2" id="fenlei2" class="form-control">
                                <option value="0">----请选择----</option>
                                <option value="客观原因">客观原因</option>
                                <option value="主观原因">主观原因</option>
                                <option value="其他原因">其他原因</option>
                            </select>
                        </div>                                                             
                    </div>        
                    <div class="form-group">
                        <label for="fenlei3" class="col-md-3 control-label">小分类:</label>
                        <div class="col-md-8">
                            <select name="fenlei3" id="fenlei3" class="form-control">
                                <option value="0">----请选择----</option>
                                <option value="计算马虎">计算马虎</option>
                                <option value="公式忘记">公式忘记</option>
                                <option value="审题不仔细">审题不仔细</option>
                                <option value="定理记错">定理记错</option>
                                <option value="题未理解">题未理解</option>
                                <option value="完全没有思路">完全没有思路</option>
                                <option value="不知道考点">不知道考点</option>
                                <option value="推导一半受阻">推导一半受阻</option>
                                <option value="公式运用不清">公式运用不清</option>
                                <option value="老师没讲">老师没讲</option> 
                                <option value="其他原因">其他原因</option> 
                            </select>             
                        </div>                                                                                                
                    </div>                                             
                    <div class="form-group">
                        <label for="biji" class="col-md-2 control-label">笔记:</label>
                        <div class="col-md-10">
                            <textarea  name="biji" id="biji" class="form-control" placeholder="自己总结复习结论等" rows="3" value=""></textarea>
                        </div> 
                    </div>
                    <div class="form-group">
                        <label for="chuchu"  class="col-md-2 control-label">出处:</label>
                        <div class="col-md-10">
                            <input type="text" name="chuchu" id="chuchu" class="form-control" placeholder="输入书籍or练习册名称等" value="">
                        </div>                                              
                    </div>
                    <hr class="mb-4">
                    <button class="btn btn-primary btn-lg btn-block" type="submit">追加</button>
                    <button class="btn btn-primary btn-lg btn-block" type="" onclick="window.close()">关闭</button>
                </div>
                <div class="col-md-6 order-md-2">
                    <h4>图片</h4>
                        <div class="form-group">
                            <label for="upyuanti">上传原题图片：</label>
                            <input id="upyuanti" class="form-control" type="file" name="ytfileinfo" onchange="upfile('upyuanti')">
                        </div>
                        <img id="yuantiShow" class="img-fluid" src="" alt="原题图片显示区域">
                        <label></label>
                        <div class="form-group">
                            <label for="updaan">上传答案图片：</label>
                            <input id="updaan" class="form-control" type="file" name="dafileinfo" onchange="upfile('updaan')">
                        </div>
                        <img id="daanShow" class="img-fluid" src="" alt="答案图片显示区域">
                </div>
            </div>
        </form>
    </div>
        

    <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
        crossorigin="anonymous"></script>
   


    <script language="javascript">
        // file upload
        function upfile(imgID){
            // 获取文件，默认1个，但是也是数组方式存放
            if(imgID=="upyuanti"){
                var file = $('#upyuanti').get(0).files[0];
            }else if(imgID=="updaan"){
                var file = $('#updaan').get(0).files[0];
            }  
            // console.log(file);
            // alert(file);
            // 创建用来读取文件的对象
            var reader = new FileReader();
            // 读取file
            reader.readAsDataURL(file);
            // 读取成功后回调函数
            reader.onload = function (e) {
                //赋值给画面显示
                if(imgID=="upyuanti"){
                    $('#yuantiShow').get(0).src = e.target.result;
                }else if(imgID=="updaan"){
                    // alert(e.target.result);
                    $('#daanShow').get(0).src = e.target.result;
                }  
                
            }
        }
    </script>
</body>

</html>